<template>
    <Page>
        <Topbar hideMenu />
        <Content>
            <Panel>
                <view class="left">
                    <Info :data="workInfo" backUrl="/pages/workbench/production/index"
                        @openCuttingPlan="openCuttingPlan" />
                </view>
                <view class="right">
                    <Empty text="当前工单已中断，请手动恢复..." />
                    <div class="btn-group">
                        <Button large type="success" @click="open1">
                            恢复
                        </Button>
                    </div>
                </view>
            </Panel>
        </Content>
        <Modal title="确认恢复吗？" ref="popup1" @confirm="confirm1" />
        <ModalCuttingPlan ref="modalCuttingPlan" @openModalPrintLabel="openModalPrintLabel"></ModalCuttingPlan>
        <ModalPrintLabel ref="modalPrintLabel" :labelTypes="[{label: '条料标签',value: '条料标签'}]"></ModalPrintLabel>
    </Page>
</template>

<script>
    import Page from "@/components/page/index.vue";
    import Topbar from "@/components/topbar/index.vue";
    import Content from "@/components/content/index.vue";
    import Panel from "@/components/panel/index.vue";
    import Empty from "@/components/empty/index.vue";
    import Button from "@/components/button/index.vue";
    import Info from "@/components/info/index.vue";
    import Modal from '@/components/modal/index.vue';
    import ModalCuttingPlan from '@/components/operate/modal-material-cutting-plan/index.vue';
    import ModalPrintLabel from '@/components/operate/modal-print-label/index.vue';
    import fetch from "@/utils/fetch";

    export default {
        components: {
            Page,
            Topbar,
            Content,
            Panel,
            Info,
            Empty,
            Button,
            Modal,
            ModalCuttingPlan,
            ModalPrintLabel
        },
        data() {
            return {
				state:'',
				flag:null,
                workInfo: {}
            }
        },
        methods: {
            getWorkOrderInfo(workCode) {
                fetch('get', '/dms/mobile/selectWorkByWorkCode', {
                    workCode
                }).then((res) => {
                    this.$set(this,'workInfo',{
                    	...res,
                    	state:this.state || res.state,
                    })
                    this.state=this.state || res.state;
                    this.checkRestoreInterruptState();
                });
            },
            openCuttingPlan() {
                this.$refs['modalCuttingPlan'].open(this.workInfo.cuttingPlanCode);
            },
            openModalPrintLabel(item){
                this.$refs['modalPrintLabel'].open(item);
            },
            checkRestoreInterruptState() {
                if (['下发', '转产中'].indexOf(this.workInfo.state) >= 0) {
                    this.goto('/pages/workbench/production/change/index?workCode=' + this.workInfo.workCode);
                }
                if (['转产完成', '调机中'].indexOf(this.workInfo.state) >= 0) {
                    this.goto('/pages/workbench/production/debug/index?workCode=' + this.workInfo.workCode);
                }
                if (['调机完成', '生产'].indexOf(this.workInfo.state) >= 0) {
                    this.goto('/pages/workbench/production/exec/index?workCode=' + this.workInfo.workCode);
                }
            },
            open1() {
                this.$refs.popup1.open()
            },
            confirm1() {
                fetch('put', '/dms/mobile/restoreInterrupt', {
                    workCode: this.workInfo.workCode,
                }).then(() => {
                    this.$toast('工单恢复成功');
                    this.getWorkOrderInfo(this.workInfo.workCode);
                });
            },
            goto(url) {
                uni.redirectTo({
                    url,
                    animationType: "pop-in",
                    animationDuration: 1000,
                })
            },
        },
        onLoad(params) {
			this.state=params.state || null;
			this.flag=params.flag || null;
            this.getWorkOrderInfo(params.workCode);
        }
    };
</script>

<style scoped lang="scss">
    .left {
        flex: 0 auto;
        width: 50rem;
        background: #f8f8fa;
    }

    .right {
        flex: 1;
        background-color: red;
        background: #fff;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: 3rem 4rem 5rem;

        .btn-group {
            display: flex;
            justify-content: center;
            align-items: center;
        }
    }
</style>